<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="board.*, java.util.*,model.*,util.*" %>

<%@ include file="../common/include/header.jsp" %>

<% DataForm dataForm = (DataForm)request.getAttribute("dataForm");%>
<%String contextPath = request.getContextPath();%>

<% long currentPage = pager.getCurrentPage();%>
<div style="width: 980px;">
<table border="0" cellpadding="0" cellspacing="0" width="980px">
	<tr>
		<td style="width: 180px;vertical-align: top;background:  #fdb73a;">
			<%@include file="../common/include/leftmenu.jsp" %>
		</td>
			<html:form action="/databoard" enctype="multipart/form-data">
		<td style="vertical-align: top;width: 800px;">
			<%@include file="logo.jsp" %>
			<div class="boardname" style="text-align: center;"><bean:write name="dataForm" property="dbname"/></div>
			
				<input type="hidden" name="method" value="getModifyForm"/>
				<input type="hidden" name="dbno" value="<%=dataForm.getDbno()%>"/>
				<input type="hidden" name="cono" value="<%=dataForm.getCono()%>"/>
				<input type="hidden" name="dbname" value="<%=dataForm.getDbname()%>"/>
				<input type="hidden" name="currentPage" value="<%=currentPage%>"/>
				
				<table border="0" cellpadding="0" cellspacing="0" width="700px" align="center">
						
					<tr><td style="text-align: center;font-weight: bold;"><%=dataForm.getDbtitle()%></td></tr>
					<tr><td style="border: 1px dotted #bbbbbb;">
						<div style="text-align: right;">
							<span style="font: 8pt;">[<%=dataForm.getRownum()%>]</span>&nbsp;
							<span><a href="javascript:;" onmousedown="popmenu1('<bean:write name="dataForm" property="mid"/>');" >
								<%=dataForm.getNick()%></a>
							</span>&nbsp;
							<span style="font-size: 7pt;color: #aaaaaa;padding-right: 10px;"><%=dataForm.getDbdate().substring(0,19) %></span>							
						</div>
						<div style="text-align: right;">
							<logic:notEmpty name="dataForm" property="originalname">				
								<a href="<%=contextPath%>/board/databoard.do?method=download&dbno=<%=dataForm.getDbno()%>">
									<img src="<%=imagePath %>icon_file.gif"/>
									<span style="font-size: 9pt;"><bean:write name="dataForm" property="originalname"/></span>
									<span style="font-size: 7pt;padding-right: 10px;">(<bean:write name="dataForm" property="fileSize"/>byte)</span>
								</a>
							</logic:notEmpty>
							</div><div id="contents" style="background: #ffffff;text-align: left;padding:10px;">
									<pre><html:hidden property="dbcontent"/></pre></div></td></tr>	
					
					<tr><td align="center">
							<a id="hidingButton" href="javascript:hidingComment();" onfocus="blur()">▲</a>
							
									<!-- comment -->
							<table style="width: 700px;text-align: center;">
								<tr><td>
									<table border="0" cellpadding="0" cellspacing="0" width="700px" align="center">
										<tr><td id="commentList" style="border: 1px dotted;"></td></tr>
										<tr id="coList"></tr>
									</table></td>
								</tr>
								<tr><td>
									<div id="main-page">	
									<form name="c_form">
										<table>
											<tr><td>Comment</td>
												<td><textarea id="content" name="comment" rows="3" cols="70"></textarea></td>
												<td><input type="button" value="Write" onclick="return check('<%=dataForm.getDbno()%>');"
														style="background: #ffffff;border: 1px solid #bbbbbb;height: 50px;width: 70px;"/></td>
												<input type="hidden" id="read" value="<%=dataForm.getDbno()%>"/>
											</tr>
										</table>						
									</form>
									</div></td>
								</tr>				
							</table>							
							
						</td></tr>	
						
					<tr><td>
							<logic:notEmpty name="dataForm" property="preview">
								<a href="databoard.do?method=detailview&dbno=<bean:write name="dataForm" property="preview.dbno"/>
										&rownum=<bean:write name="dataForm" property="preview.rownum"/>">
								[이전글]<bean:write name="dataForm" property="preview.dbtitle"/></a>
							</logic:notEmpty>		
						</td></tr>
					<tr><td>
							<logic:notEmpty name="dataForm" property="next">
								<a href="databoard.do?method=detailview&dbno=<bean:write name="dataForm" property="next.dbno"/>
										&rownum=<bean:write name="dataForm" property="next.rownum"/>"">
								[다음글]<bean:write name="dataForm" property="next.dbtitle"/></a>
							</logic:notEmpty>		
						</td></tr>
					<tr><td align="right">							
							<html:link href="javascript: checkModify();"><img src="<%=imagePath %>icon_update.jpg"/></html:link>
							<html:link href="javascript: checkUser('delete');"><img src="<%=imagePath %>icon_delete.jpg"/></html:link>
							<html:link href="javascript: goList('getList');"><img src="<%=imagePath %>icon_list.jpg"/></html:link>			
						</td></tr>			
				</table>				
		</td>
			</html:form>
				
	</tr>
</table>
</div>
<%@ include file="../common/include/footer.jsp" %>
<script type="text/javascript">
	window.onload = function(){
		loadCoList();
	}
	//코멘트 관련 자바 스크립트 
	var xmlHttp;		
	
	//XMLHttpRequest 객체 생성
	function createXMLHttpRequest(){
		if(window.ActiveXObject){
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}else if(window.XMLHttpRequest){
			xmlHttp = new XMLHttpRequest();
		}
	}
	
	//리스트 불러오기
	function loadCoList(){
		var url ="<%=path%>/board/datacomment.do?method=getCommentList";
		var dbno = "dbno=<%=dataForm.getDbno()%>";
		var cono = "&cono=<%=dataForm.getCono()%>";
		createXMLHttpRequest();
		xmlHttp.open("POST",url,true);
		xmlHttp.onreadystatechange = handleStateChange;
		xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		xmlHttp.send(dbno+cono);
	}	
	
	function handleStateChange() {
	    if(xmlHttp.readyState == 4) {
	    	if(xmlHttp.status == 200){
	    		loadList();	       
			}	           
	    }
	}			
	//리스트 보여주기
	function loadList(){
		var xmlDoc = xmlHttp.responseXML;
		var comment = xmlDoc.getElementsByTagName('comment');
		for(var i=0;i<comment.length;i++){			
			var dbno = comment[i].getElementsByTagName('dbno')[0].firstChild.nodeValue;
			var dcno = comment[i].getElementsByTagName('dcno')[0].firstChild.nodeValue;			
			var mid = comment[i].getElementsByTagName('mid')[0].firstChild.nodeValue;
			var nick = comment[i].getElementsByTagName('nick')[0].firstChild.nodeValue;
			var dccomment = comment[i].getElementsByTagName('dccomment')[0].firstChild.nodeValue;
			var dcdate = comment[i].getElementsByTagName('dcdate')[0].firstChild.nodeValue;
			var iconno = comment[i].getElementsByTagName('iconno')[0].firstChild.nodeValue;
			
			var newCell = createCell(dbno,dcno,mid,nick,dccomment,dcdate,iconno);
			commentList.appendChild(newCell);			
		}
		xmlHttp =null;		
	}
	
	//리스트만들기
	function createCell(dbno,dcno,mid,nick,dccomment,dcdate,iconno){
		var cell = document.createElement('div');
		cell.style.textAlign = "left";
		cell.style.width = "680";

		var table = document.createElement('table');
		var tbody = document.createElement('tbody');
		var tr = document.createElement('tr');
		
		//꼬리말 작성자
		var id = document.createElement('td');
		id.innerHTML = '<a href="javascript:;" onmousedown="popmenu1(\''+mid+'\')">'+nick+'</a>';
		//id.appendChild(document.createTextNode(nick));
		id.style.width = "60";		
		id.name = mid;
		
		//꼬리말 내용
		var comment = document.createElement('td');
		comment.appendChild(document.createTextNode(dccomment));		
		comment.style.width = "480";
		
		
		//꼬리말작성일
		var date = document.createElement('td');
		date.appendChild(document.createTextNode("["+dcdate+"]"));
		date.style.fontSize = '8pt';
		date.style.width = "120";				
		
		//삭제버튼달기
		var deleteButton = document.createElement('td');
		if(mid=="<%=user.getMid()%>"||<%=user.getUserInfo().getLvno()>7%>){
			var dButton = document.createElement('a');
			dButton.appendChild(document.createTextNode("x"));
			dButton.style.width = "10";
			dButton.style.height = "10";
			dButton.style.color = "red";
			dButton.href="javascript:confirmRemove("+dcno+");";
			
			deleteButton.appendChild(dButton);
		}
		tr.appendChild(date);
		tr.appendChild(id);
		tr.appendChild(comment);				
		tr.appendChild(deleteButton);
		
		tbody.appendChild(tr);
		table.appendChild(tbody);
		
		cell.appendChild(table);		
		cell.name = dcno;
		
		return cell;		
	}

	//꼬리말 달기 체크
	function check(dbno){
		var comment = document.getElementById('content').value.replace(/\/s/g,"");
		if(comment.length>4){
			if(confirm("코멘트를 등록하시겠습니까?")){
			addComment(dbno);			
			}
		}else{
			alert("코멘트는 최소 5자 이상 입력하셔야 합니다.");
			return false;		
		}	
				
	}	

	//꼬리말 달기
	function addComment(no){
		createXMLHttpRequest();				
		var dbno = "dbno="+no;
		var dccomment = escape(encodeURIComponent(document.getElementById('content').value));
		var id = "&mid=<%=user.getMid()%>";
		var com = "&dccomment="+dccomment;
		var cono = "&cono=<%=dataForm.getCono()%>";		
		var data = dbno+id+com+cono;		
 				
		var url = "datacomment.do?method=add";
							
		xmlHttp.open("POST", url, true);		
		xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		xmlHttp.onreadystatechange = show;
		xmlHttp.send(data);		
	}
	
	function show(){
		if(xmlHttp.readyState == 4){
			if(xmlHttp.status == 200){
				setComment();			
			}else{
				alert("Error!!  "+xmlHttp.status);
			}
		}
	}
	
	//꼬리말 리스트에 추가하기
	function setComment(){
		var xmlDoc = xmlHttp.responseXML;
		var com = xmlDoc.getElementsByTagName('comment');
		
		var dbno =com[0].getElementsByTagName("dbno")[0].firstChild.nodeVale;
		var dcno = com[0].getElementsByTagName("dcno")[0].firstChild.nodeValue;		
		var mid = com[0].getElementsByTagName("id")[0].firstChild.nodeValue;
		var nick = com[0].getElementsByTagName("nick")[0].firstChild.nodeValue;
		var dccomment = com[0].getElementsByTagName("message")[0].firstChild.nodeValue;								
		var dcdate = com[0].getElementsByTagName("day")[0].firstChild.nodeValue;
		var iconno =com[0].getElementsByTagName("iconno")[0].firstChild.nodeValue;
			
		var newCell = createCell(dbno,dcno,mid,nick,dccomment,dcdate,iconno);
		commentList.appendChild(newCell);		
	
		document.getElementById('content').value="";
		
	}	
	
	//꼬리말 삭제 확인
	function confirmRemove(dcno){
		if(confirm("코멘트를 삭제하시겠습까?")){				
			test(dcno);			
		}
	}
		
	var removingTarget =0; 
	
	function test(dcno){
		var cmts = commentList.getElementsByTagName('div');		
		for(var i=0;i<cmts.length;i++){
			if(cmts[i].name==dcno||<%=user.getUserInfo().getLvno()>7%>) {
				remove(dcno);
				removingTarget = cmts[i];				
			}
		}
	}
	
	function remove(dcno){	
		var url = "<%=path%>/board/datacomment.do?method=delete&dcno="+dcno;
		createXMLHttpRequest();
		xmlHttp.open("GET",url,true);
		xmlHttp.onreadystatechange = deleteComment;
		xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");		
		xmlHttp.send(null);
	}	
	
	function deleteComment(){
		if(xmlHttp.readyState == 4){
			if(xmlHttp.status == 200){
				var parent = removingTarget.parentNode;
				parent.removeChild(removingTarget);						
			}else{
				alert("삭제 실패");
			}			
		}
	}
	
	//코멘트 숨기기
	function hidingComment(){
		if(commentList.style.display==""){
			commentList.style.display = "none";
			hidingButton.innerText = "▼"
		}else {			
			commentList.style.display = "";
			hidingButton.innerText = "▲"
		}		
	}

</script>

<script type="text/javascript">
	//게시물 삭제 권한 체크
	<%Member m = user.getUserInfo();%>
		var mLvno = <%=m.getLvno()%>
	function checkUser(m){		
		if(<%=user.getMid().equals(dataForm.getNick())%>||<%=user.getMcnick().equals(dataForm.getNick())%>){
			confirmDelete(m);
		}else if(mLvno>=8){
			confirmDelete(m);						
		}else{
			alert("삭제 권한이 없습니다.");
			return;
		}		
	}
	
	//게시물 수정 권한 체크
	function checkModify(){
		if(<%=user.getMid().equals(dataForm.getNick())%>||<%=user.getMcnick().equals(dataForm.getNick())%>){
			dataForm.submit();	
		}else if(mLvno>=8){
			dataForm.submit();
		}else{
			alert("수정 권한이 없습니다.");
			return;
		}
	}
	
	//게시물 삭제
	function confirmDelete(m){
		if(confirm("게시물을 삭제하시겠습니까?")){
			var method = document.getElementById('method');
			method.value= m;
			dataForm.submit();
			
		}
	}
	//목록으로 돌아가기
	function goList(m){		
		var method = document.getElementById('method');
		//method.value ="";		
		method.value = m;	
		dataForm.submit();
	}
	
	// 게시물 내용 태그 처리부분
	window.attachEvent("onload",convert);
	
	function convert(){
		var content = document.getElementById('dbcontent').value;
		
		content = content.replace(/&lt;/g,"<");
		content = content.replace(/&gt;/g,">");
		content = content.replace(/&amp;/g,"&");
		content = content.replace(/&nbsp;/g," ");
		content = content.replace(/&quot;/g,"\"");
		
		document.getElementById('contents').innerHTML = content;
	}
	
</script>



